<template>
  <base-breadcrumb>
    <searchData
      :search-data="searchArr"
      @search="search"
    />

    <a-card :bordered="false">
      <!-- <title-name title="资产台账" /> -->
      <list-table
        ref="table"
        :request="loadData"
        :columns="columns"
         :out-selected-row-keys="selectedRowKeys"
        :statistics-config="{ use: true, statistics, temp }"
        :exportConfig="{ use: true,select: '导出选中',all: '导出全部'}"
      >
         <a-button slot="prefix" v-btnPermission="'mm_017_add_01'" type="primary" icon="plus" @click="handleEdit(null, 1)"> 新增 </a-button>
         <a-button slot="prefix" type="primary" @click="surplus()" v-if="hideBuquBtn()"> 标记剩余 </a-button>
         <template slot="index" slot-scope="text, record, index">
          {{ index + 1 }}
        </template>
        <!-- <a-table-column key="assetsNum" title="资产编号" data-index="assetsNum"> -->
        <template slot="assetsNum" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.assetsNum }}</span>
          <span v-else> {{ record.assetsNum }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="materialName" title="资产名称" data-index="materialName"> -->
        <template slot="materialName" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.materialName }}</span>
          <span v-else> {{ record.materialName }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="materialCode" title="资产编码" data-index="materialCode"> -->
        <template slot="materialCode" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.materialName }}</span>
          <span v-else> {{ record.materialName }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="materialModel" title="规格型号" data-index="materialModel"> -->
        <template slot="materialModel" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.materialModel }}</span>
          <span v-else> {{ record.materialModel }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="supplierName" title="品牌厂家名称" data-index="supplierName"> -->
        <template slot="supplierName" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.supplierName }}</span>
          <span v-else> {{ record.supplierName }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="quantity" title="残量" data-index="quantity"> -->
        <template slot="quantity" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.quantity }}</span>
          <span v-else> {{ record.quantity }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="custodianStr" title="保管人" data-index="custodianStr"> -->
        <template slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.custodianStr }}</span>
          <span v-else> {{ record.custodianStr }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="orgStr" title="资产所属单位" data-index="orgStr"> -->
        <template slot="orgStr" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.orgStr }}</span>
          <span v-else> {{ record.orgStr }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="assetsTypeStr" title="资产类别" data-index="assetsTypeStr"> -->
        <template slot="assetsTypeStr" slot-scope="text, record">
          <span v-if="record.remainder" style="color: red"> {{ record.assetsTypeStr }}</span>
          <span v-else> {{ record.assetsTypeStr }}</span>
        </template>
        <!-- </a-table-column> -->
        <!-- <a-table-column key="statusStr" title="资产状态" data-index="statusStr"> -->
        <template slot="statusStr" slot-scope="text, record">
          <span v-show="record.status === 'ASSETS_DRAFT'" class="pub-list-draft">
            <span v-if="record.remainder" style="color: red"> {{ record.statusStr }}</span>
            <span v-else> {{ record.statusStr }}</span>
          </span>
          <span v-show="record.status === 'ASSETS_NORMAL'" class="pub-list-pass">
            <span v-if="record.remainder" style="color: red"> {{ record.statusStr }}</span>
            <span v-else> {{ record.statusStr }}</span>
          </span>
          <span v-show="record.status === 'ASSETS_EXHAUST'" class="pub-list-del">
            <span v-if="record.remainder" style="color: red"> {{ record.statusStr }}</span>
            <span v-else> {{ record.statusStr }}</span>
          </span>
          <span v-show="record.status === 'ASSETS_OVER'" class="pub-list-rejected">
            <span v-if="record.remainder" style="color: red"> {{ record.statusStr }}</span>
            <span v-else> {{ record.statusStr }}</span>
          </span>
        </template>
        <!-- </a-table-column> -->
        <div slot="operation" slot-scope="text, record">
          <MoreButton>
          <a @click="handleEdit(record, 3)">查看</a>
          <a @click="handleEdit(record, 2)" v-if="hideBuquBtn()">编辑</a>
          <!-- <approval-button :id="record.id" :status="record.auditStatus"
                           v-if="record.auditStatus === 'PAST' || record.auditStatus === 'SUBMITTED' || record.auditStatus === 'REJECTED' || record.auditStatus === 'REVOKEIN' || record.auditStatus === 'REVOKE' || record.auditStatus === 'ABOLISH' || record.auditStatus === '1' || record.auditStatus === '3' || record.auditStatus === 'COMMIT'|| record.auditStatus === '2' "
          /> -->
          </MoreButton>
        </div>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { parameterList, parameterDel, surplus, findListCount } from '@/api/material/assets/parameter'
import { selectOption } from '@/api/material/goods/goods'
const columns = [
  {
    title: '序号',
    width: '65px',
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '设计变更编号',
    dataIndex: 'changeNum',
    width: '240px',
    ellipsis: true
  },
  {
    title: '设计变更名称',
    dataIndex: 'changeName',
    width: '240px',
    ellipsis: true
  },
  {
    title: '项目名称',
    dataIndex: 'projectName',
    width: '120px',
    ellipsis: true
  },
  {
    title: '分公司',
    dataIndex: 'branch',
    width: '120px',
    ellipsis: true
  },
  {
    title: '项目设计管理类别',
    dataIndex: 'type',
    width: '150px',
    ellipsis: true
  },
  {
    title: '施工图设计单位',
    dataIndex: 'designUnit',
    width: '240px',
    ellipsis: true
  },
  {
    title: '施工图版本编号',
    dataIndex: 'versionNum',
    width: '150px',
    ellipsis: true
  },
  {
    title: '变更原因',
    dataIndex: 'changeReason',
    width: '120px',
    ellipsis: true
  },
  {
    title: '变更类型',
    dataIndex: 'changeType',
    width: '240px',
    ellipsis: true
  },
  {
    title: '变更费用(万)',
    width: '120px',
    dataIndex: 'changeCost'
  },
  {
    title: '状态',
    width: '120px',
    dataIndex: 'statusName',
    scopedSlots: { customRender: 'statusCode' }
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 200,
    fixed: 'right',
    scopedSlots: { customRender: 'operation' }
  }
]

export default {
  name: 'a' + Date.now(),
  data() {
     return {
      loading: false,
      queryParam: {},
      pageNo: 1,
      pageSize: 10,
      totalSize: 0,
      searchArr: [
        {
          name: '资产编号',
          value: 'assetsNum',
          type: 'input'
        },
        {
          name: '资产名称',
          value: 'materialName',
          type: 'input'
        },
        {
          name: '资产编码',
          value: 'materialCode',
          type: 'input'
        },
        {
          name: '资产类别',
          value: 'assetsTypeId',
          type: 'select',
          data: []
        },
        {
          name: '规格型号',
          value: 'materialModel',
          type: 'input'
        },
        {
          name: '品牌厂家名称',
          value: 'supplierName',
          type: 'input'
        },
        {
          name: '保管人',
          value: 'custodianStr',
          type: 'input'
        },
        {
          name: '资产所属单位',
          value: 'orgStr',
          type: 'input'
        },
        {
          name: '资产状态',
          value: 'status',
          type: 'select',
          data: [
            { label: '草稿中', value: 'ASSETS_DRAFT' },
            { label: '正常', value: 'ASSETS_NORMAL' },
            { label: '耗尽', value: 'ASSETS_EXHAUST' },
            { label: '过期', value: 'ASSETS_OVER' }
          ]
        }
      ],
      columns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'index' },
          dataIndex: 'index',
          width: 70
        },
        {
          title: '资产编号',
          dataIndex: 'assetsNum',
          width: 120
        },
        {
          title: '资产名称',
          dataIndex: 'materialName',
          width: 120
        },
        {
          title: '资产编码',
          dataIndex: 'materialCode',
          width: 120
        },
        {
          title: '规格型号',
          dataIndex: 'materialModel',
          width: 120
        },
        {
          title: '品牌厂家名称',
          dataIndex: 'supplierName',
          width: 120
        },
        {
          title: '残量',
          dataIndex: 'quantity',
          width: 120
        },
        {
          title: '保管人',
          dataIndex: 'custodianStr',
          width: 120
        },
        {
          title: '资产所属单位',
          dataIndex: 'orgStr',
          width: 120
        },
        {
          title: '资产类别',
          dataIndex: 'assetsTypeStr',
          width: 120
        },
        {
          title: '资产状态',
          dataIndex: 'statusStr',
          scopedSlots: { customRender: 'statusStr' },
          width: this.STATUS_WIDTH
        },
        {
          title: '操作',
          dataIndex: 'operation',
          scopedSlots: { customRender: 'operation' },
          width: 120,
          fixed: 'right'
        }
      ],
      selectedRowKeys: [],
      selectId: [],
      selectedRows: [],
      chooseData: 0,
      tableData: [],
      statistics: {},
       temp: () => {
        return (
          <span style="margin-right: 12px">
            总计：<span class="totalNum">{this.totalSize || 0} 个</span> |
            草稿中：<span class="totalNum">{this.statistics.assetsDraft || 0} 个</span> |
            耗尽：<span class="totalNum">{this.statistics.assetsExhaust || 0} 个</span> |
            正常：<span class="totalNum">{this.statistics.assetsNormal || 0} 个</span>
            过期：<span class="totalNum">{this.statistics.assetsOver || 0} 个</span>
          </span>
        )
      },
      loadData: (params) => {
        let searchData = Object.assign(params, this.queryParam)
        findListCount(searchData).then((res) => {
          if (res.code === this.SUCCESS_CODE) {
            this.statistics = res.data
          }
        })
        return parameterList(searchData).then((res) => {
          this.totalSize = res.totalSize
          return res
        })
      },
      pathName: this.$route.path
    }
  },

  created() {
    this.getCategoryArr()
  },
  methods: {
       async surplus() {
        console.log('thisthisthis',this.$refs.table.selectedRowKeys)
      if (!this.$refs.table.selectedRowKeys.length) {
        return this.$noticeWarning('请选择要标记的数据')
      }
      let res = await surplus({ ids: this.$refs.table.selectedRowKeys })
      if (res.code === this.SUCCESS_CODE) {
        this.$noticeSuccess('标记成功')
        // this.list()
         this.$refs.table.refresh()
      }
    },
    async getCategoryArr() {
      let res = await selectOption({ type: 25 })
      if (res.code === 200) {
        res.data.map((v) => {
          this.searchArr[3].data.push({ label: v.name, value: v.id })
        })
      }
    },
    search(val) {
      this.queryParam = val
      // this.list(val)
      this.$refs.table.refresh()
    },
     handleDel(id) {
      let _this = this
      let params = id ? [id] : _this.selectId
      _this.delList(
        parameterDel,
        () => {
          _this.search()
          this.selectedId = []
          this.$refs.table.selectedRowKeys = []
          this.selectedRows = []
          this.editingKey = ''
        },
        { ids: params }
      )
    },
    handleEdit(record, state) {
      this.$router.push({
        path: '/material/assets/parameter/add',
        query: {
          id: record && record.id,
          state: state
        }
      })
    }
  }
}
</script>


